<template>
  <div>
    <el-row :gutter="10" style="padding: 30px;">
      <el-col :span="16">
        <span>表单项名称：</span> <el-input v-model="input" placeholder="请输入表单项名称" clearable style="width: 20%;" />

        <el-button style="margin-left: 2%;" type="primary" icon="el-icon-search" @click="itemseacher">搜索</el-button>
      </el-col>
    </el-row>
    <!--  新建表单-->
    <auditdesign :items="items" @save="save" />
  </div>
</template>

<script>
import Bus from '@/utils/eventBus.js'

export default {
  name: 'Formpage',
  data() {
    return {
      items: [],
      bigidarr: [],
      id: null,
      fromid: null,
      fromidarr: [],
      formdata: {},
      input: '' // 输入框内容
    }
  },
  computed: {
    idarr() {
      return this.$store.state.print.bigidarr
    }

  },

  watch: {
    bigidarr: {
      handler: function(val, oldval) {
        this.bigidarr = val
      }
    },
    fromidarr(val) {
      this.fromidarr = val
      this.$store.dispatch('set_item', this.fromidarr)
    }

  },
  created() {
    this.getqueryid()
    this.gitalllist()
  },

  methods: {
    // 搜索

    itemseacher() {
      this.$Http.newsearchItem({
        formIndexName: this.input
      }).then(res => {
        const valTemps = []
        const valTypes = []
        if (res.code === 200) {
          for (let r = 0; r < res.result.length; r++) {
            valTypes.push({
              type: 'assembly',
              name: res.result[r].formIndexName,
              id: res.result[r].id
            })
            valTemps.push(res.result[r].formIndexJsonObject)
          }
          this.items = []
          for (var c = 0; c < valTypes.length; c++) {
            const newitem = {
              type: valTypes[c],
              data: valTemps[c]
            }
            console.log(newitem)
            this.items.push(newitem)
          }
        }
      }).catch(err => {
        console.log('err', err)
      })
    },

    save(data) {
      console.log('最终', data)

      this.$prompt('请输入表单名称', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消'
      }).then(({
        value
      }) => {
        this.$Http.formverification({
          formName: value
        }).then(res => {
          if (res.code === 200) {
            this.$Http.savefrom({
              formName: value,
              formJson: '',
              formItemIds: data.idarr
            }).then(res => {
              if (res.code === 200) {
                this.$message({
                  type: 'success',
                  message: '新建' + value + '完成'

                })
                this.$router.push({
                  path: '/guanlifrom'
                })
              }
            }).catch(err => {
              console.log('err', err)
            })
          } else {
            this.$message({
              type: 'error',
              message: res.message

            })
          }
        }).catch(err => {
          console.log('err', err)
        })
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '取消输入不能提交!'
        })
      })
    },
    // 取所有按钮
    async gitalllist() {
      try {
        const res = await this.$Http.getbtnall()
        const valTemp = []
        const valType = []

        if (res.code === 200) {
          for (let r = 0; r < res.result.length; r++) {
            valType.push({
              type: 'assembly',
              name: res.result[r].formIndexName,
              id: res.result[r].id
            })
            valTemp.push(res.result[r].formIndexJsonObject)
          }

          for (var c = 0; c < valType.length; c++) {
            const item = {
              type: valType[c],
              data: valTemp[c]
            }
            this.items.push(item)
          }

          for (var l = 0; l < res.result.length; l++) {
            if (this.id != null) {
              if (this.id === res.result[l].id) {
                Bus.$emit('itemid', l)
              }
            } else {
              return
            }
          }
        }
      } catch (err) {
        console.log('err', err)
      }
    },
    // 获取id
    getqueryid() {
      this.id = this.$route.query.id
      this.fromid = this.$route.query.fromid
      console.log('this.fromid', this.fromid)
      if (this.fromid !== undefined) {
        this.getformids()
      }
    },
    async getformids() {
      try {
        const res = await this.$Http.frombianji(this.fromid)
        if (res.code === 200) {
          this.fromidarr = res.result.formItemIds
          this.formdata = JSON.parse(res.result.formJson)
        } else {
          this.$message({
            type: 'success',
            message: res.message
          })
        }
      } catch (err) {
        console.log('err', err)
      }
    }

  }
}
</script>

<style scoped>

</style>
